<template>
	<scroll-view scroll-y="true" class="Index" @scrolltolower="reLoadData">
		<search></search>
		<navs></navs>
		<commodity :imgList="commodityItem"></commodity>
	</scroll-view>
</template>

<script>
	/**
	 * @@param {components} search 搜索按钮
	 * @@param {components} navs 导航栏
	 * @@param {components} commodity 商品栏
	 * @@param {Array} commodityItem 商品数据数组  
	 */
	import search from '../../wxcomponents/index/search.vue'
	import navs from '../../wxcomponents/index/nav.vue'
	import commodity from '../../wxcomponents/index/commodity.vue'
	import {refleshData} from '@/utils/index.js'
	export default {
		components:{
			search,navs,commodity
		},
		data() {
			return {
				commodityItem:[
					{img:'https://tse4-mm.cn.bing.net/th/id/OIP-C.CwphT-TxNCYtlvPGzmXgLgHaHa?w=204&h=204&c=7&r=0&o=5&pid=1.7',msg:'啦啦啦啦啦测试一下商品名称部分 hhhh',price:'100.0'},
					{img:'https://tse3-mm.cn.bing.net/th/id/OIP-C.9yF1qc8acYZfFOZds8oK-QHaLU?w=202&h=309&c=7&r=0&o=5&pid=1.7',msg:'啦啦啦啦啦测试一下商品名称部分 hhhh',price:'100.0'},
					{img:'https://tse4-mm.cn.bing.net/th/id/OIP-C.79PRSa7XCw9oU8RqGvV4yQHaEo?w=204&h=127&c=7&r=0&o=5&pid=1.7',msg:'啦啦啦啦啦测试一下商品名称部分 hhhh',price:'100.0'},
					{img:'https://tse4-mm.cn.bing.net/th/id/OIP-C.uVlMmR0sbVN2omJ0YWYW0wHaNK?w=187&h=333&c=7&r=0&o=5&pid=1.7',msg:'啦啦啦啦啦测试一下商品名称部分 hhhh',price:'100.0'}
				]
			}
		},
		onLoad() {
			//模拟网络请求
			/*setInterval(()=>{
				this.commodityItem.push(
					{img:'https://tse4-mm.cn.bing.net/th/id/OIP-C.dkgNdvM9taM_ld-j5pPyOQHaKs?w=204&h=294&c=7&r=0&o=5&pid=1.7',msg:'1'},
					{img:'https://tse2-mm.cn.bing.net/th/id/OIP-C.KAmu_DpqH70iBJfqf1H8CwHaEK?w=204&h=115&c=7&r=0&o=5&pid=1.7',msg:'2'},
					{img:'https://tse1-mm.cn.bing.net/th/id/OIP-C.I_lEYAoJce2f-xTxJe5XtwHaGl?w=204&h=181&c=7&r=0&o=5&pid=1.7',msg:'3'},
					{img:'https://tse4-mm.cn.bing.net/th/id/OIP-C.SHeRlirRfIw_m5Sv3U8VOAAAAA?w=198&h=315&c=7&r=0&o=5&pid=1.7',msg:'4'}
				)
			},1000)*/
		},
		methods: {
			reLoadData(){
				let data =  refleshData()
				console.log(data)
				data = [...this.commodityItem,...data]
				this.commodityItem = data
			}
		}
	}
</script>

<style lang="less">
	.Index{
		position: relative;
		height: 100vh;
	}
</style>
